<template>
  <div>
    <div class="window_top_wrap">
      <div class="window_main_wrap_75">
        <div class="login_scnav_wrap_new">
          <div class="header_new">
            <my-header></my-header>
          </div>
        </div>
        <div class="main_content">
          <div class="boder-gray">
            <div class="title_tops">
              <p>
                <i class="baoming_icon"></i
                >{{ counties.countiesName }}小学新生入学报名
              </p>
            </div>
            <div class="cqbgxx_wrap flowone">
              <ul class="cqbgxx_ul">
                <li class="one">
                  小学新生入学：根据适龄儿童（少年）户籍和家庭住房情况，依据“房户一致”优先原则，在划定学区内小学按下列生源排序注册入学。<br />
                  1、有房有户； 2、有户无房（第一类）； 3、有房无户；
                  4、有户无房（第二类）； 5、无户无房
                </li>
                <li class="two">
                  个别学区由于生源增长导致容量不够，不能完全接纳本学区适龄儿童（少年）入学的，由学校进行登记，区教育行政部门按照生源排序和相对就近的原则统筹安排
                </li>
                <li class="three">
                  各区县（市）小学具体招生入学政策及学区划分情况，可以咨询所在地区教育行政部门
                </li>
              </ul>
              <p class="btn_wrap">
                <span
                  class="btn_white_green mr20"
                  onclick="window.open('/index_image?path=n_1.jpg')"
                  >入学报名流程</span
                ><span
                  class="btn_white_green"
                  onclick="window.open('/doc/p_1.pdf')"
                  >操作手册</span
                >
              </p>
              <div class="baoming_items">
                <p class="title">微信报名</p>
                <p class="tips">
                  友情提示：微信报名可及时接收学校的通知消息。（推荐）
                </p>
                <div class="content">
                  <div class="left_img">
                    <img src="http://rxbm.csedu.gov.cn/imgs/qrcode.jpg" />
                    <p>请用微信扫描二维码在线报名</p>
                  </div>
                  <div class="right_img">
                    <p>报名流程：</p>
                    <i class="bmlc_one"></i>
                  </div>
                </div>
              </div>
              <div class="baoming_items">
                <p class="title">电脑报名</p>
                <p class="tips">
                  友情提醒：电脑报名需家长常用手机号码进行注册报名，便于学校联系。
                </p>
                <div class="content">
                  <div class="left_img">
                    <img src="http://rxbm.csedu.gov.cn/imgs/computer.png" />
                  </div>
                  <div class="right_img">
                    <p>报名流程：</p>
                    <i class="bmlc_two"></i>
                  </div>
                </div>
              </div>
              <p class="baoming_btn_wrap">
                <span
                  class="btn_green_white"
                  id="baoming_btn"
                  @click="toIndexAreaPage()"
                  >立即网上报名</span
                >
              </p>
            </div>
          </div>
        </div>
      </div>
      <div class="footer bgwhite">
        主办单位：湖南省长沙市教育局&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a
          href="https://beian.miit.gov.cn/"
          target="_blank"
          style="color: #929292"
          >备案号: 湘ICP备05005530号-1 </a
        >本网站由长沙市教育局信息中心承办
      </div>
    </div>
  </div>
</template>

<script>
import counties from "@/api/counties.js";

export default {
  name: "IndexElementary",

  data() {
    return {
      countiesId: "",
      schoolGrade: '',
      counties: {},
    };
  },

  mounted() {
    this.countiesId = this.$route.params.countiesId;
    this.schoolGrade = this.$route.params.schoolGrade;
    console.log(this.countiesId);
    this.selectByPrimary();
  },

  methods: {
    /**
     * 跳转到学校的界面
     */
    toIndexAreaPage() {
      this.$router.push({ path: `/index_area.html/${this.schoolGrade}/${this.countiesId}` });
    },
    /**
     * 通过countiesId查询县区信息
     */
    selectByPrimary() {
      if (this.countiesId) {
        counties
          .selectByPrimary(this.countiesId)
          .then((res) => {
            let data = res.data;
            console.log(data);
            if (data.ok) this.counties = data.data;
            else this.$message.error("countiesId query fail");
          })
          .catch((err) => {
            console.log(err);
          });
      } else this.$message.error("countiesId undefined");
    },
  },
  watch: {
    $route(to) {
      console.log("IndexElementary:", to.path);
      if (to.path.includes("/index_elementary.html")) {
        this.countiesId = this.$route.params.countiesId;
        this.selectByPrimary();
      }
    },
  },
};
</script>

<style scoped>
.baoming_items .content .right_img .bmlc_one,
.baoming_items .content .right_img .bmlc_two {
  background: url("../assets/imgs/flow.png") no-repeat;
}
</style>